/* 学习目标：props的特殊属性 children  */

import React from 'react';

export default function App() {
  return (
    <div>
      {/* 组件标签夹着的内容区域， 自动会出现在props.children属性上 */}
      {/*  💥 children可以传任意数据类型 */}
      <Child> 123</Child>
      <Child>{123}</Child>
      <Child>{[1, 2, 3]}</Child>
      <Child>{{ name: 'zs', age: 18 }}</Child>
      <Child>
        {() => {
          alert(123);
        }}
      </Child>
    </div>
  );
}

function Child(props) {
  console.log('props  ----->  ', props);
  return (
    <h2>
      我是子组件 - <button onClick={props.children}>点我</button>
    </h2>
  );
}
